


/**
 * Created by lishengyong on 2017/4/14.
 */

import React from 'react';
import TableHeader from './TableHeader';
import TableRow from './TableRow';
import { cloneDeep } from 'lodash'
import constant from './constant'

require('./BlueseaTable.scss');

const classes = {
    hightlighted: 's-bs-table__content__tr--hightlighted',
}

class TableContainer extends React.Component {

    constructor(props) {
        super(props);

        this.state = {
        }
        this.changeCellEditStatus = this.changeCellEditStatus.bind(this)
        this.onInputChange = this.onInputChange.bind(this)
        this.changeCellEditStatus = this.changeCellEditStatus.bind(this)
    }

    componentWillReceiveProps(nextProps) {

    }

    onInputChange(value, rowIndex, columnIndex, key) {
        this.props.onInputChange && this.props.onInputChange(value, rowIndex, columnIndex, key);
    }

    changeCellEditStatus(item, rowIndex, column, type) {
        this.props.changeCellEditStatus && this.props.changeCellEditStatus(item, rowIndex, column, type);
    }

    render() {

        const { data, columns } = this.props;

        return (
            <div className="s-bs-table">
                <div className="s-bs-table__header"></div>
                <div className="s-bs-table__content">

                    <TableHeader
                        columns={columns}
                    />
                    <div className="s-bs-table__content__main">
                        <TableRow
                            columns={columns}
                            data={data}
                            onInputChange={this.onInputChange}
                            changeCellEditStatus={this.changeCellEditStatus}
                        >
                        </TableRow>
                    </div>

                </div>
                <div className="s-bs-table__footer"></div>
            </div>
        )
    }
}

export default TableContainer;


